<!--
 * @Author: wangjh wangjiahui0710@163.com
 * @Date: 2024-06-18 10:06:27
 * @LastEditors: wangjh wangjiahui0710@163.com
 * @LastEditTime: 2024-06-20 16:14:56
 * @FilePath: \cip-admin\src\pages\park\dual-prevention\statistical-analysis\index.page.vue
 * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
-->
<script lang="ts" setup>
import DetailDialog from "./components/detail-dialog.vue";
import Filter from "./components/filter.vue";
import Handler from "./components/handler.vue";
import Sheet from "./components/sheet.vue";
import Statistic from "./components/statistic.vue";
import { createState } from "./state";

definePage({
	meta: { title: "统计分析", order: 6 },
});
defineOptions({ name: "IndexPage" });
const { page, detailDialogRef } = createState();

const switchVal = ref(false);
</script>

<template>
	<page-content>
		<template #header>
			<Filter />
			<div class="switchPage">
				<el-switch
					v-model="switchVal"
					class="mb-2"
					active-text="报表"
					inactive-text="图形"
					style="--el-switch-off-color: #165dff"
				/>
			</div>
		</template>
		<Sheet v-if="switchVal" />
        <Statistic v-else />
		<!-- <DetailDialog ref="detailDialogRef" />
		<template #footer>
			<el-pagination
				v-model:current-page="page.currentPage.value"
				v-model:page-size="page.pageSize.value"
				:disabled="page.isLoading.value"
				:total="page.total.value"
			/>
		</template> -->
	</page-content>
</template>

<style lang="scss" scoped>
.switchPage {
	position: absolute;
	top: 11%;
	right: 4%;
}
</style>
